package myJs.companyMember

import myJs.companyMember.updateWorkflow.UpdateWorkflow
import myJs.companyMember.viewTest.ViewTest
import myJs.cps.Style
import myJs.member.editSample.EditSample
import myJs.member.viewSample.ViewSample
import myJs.tool.Pojo.LeftItem
import slinky.core.FunctionalComponent
import slinky.core.annotations.react
import slinky.web.html._
import typings.csstype.csstypeStrings

/**
 * Created by yz on 22/4/2022
 */
@react object LeftCp {

  type Props = Unit

  val component = FunctionalComponent[Props] { props =>

    val items=CompanyMember.pages.filterNot{x=>
      List(UpdateWorkflow,ViewTest).contains(x)
    }.map{x=>
      LeftItem(id = x.path, path = s"#/${CompanyMember.prefix}/${x.path}", title = x.titleStr, faClass = x.faClass)
    }

    div(className:="page-sidebar-wrapper",
      div(style:=Style(display = csstypeStrings.block),className:="page-sidebar navbar-collapse collapse",

        ul(className := "page-sidebar-menu", data - "auto-scroll" := "true", data - "slide-speed" := "200",
          li(className := "sidebar-toggler-wrapper",
            div(className := "menu-toggler sidebar-toggler",
              span(style := Style(fontSize = "16px", marginLeft = "6px"), className := "fa fa-navicon")
            )
          ),
          li(style := Style(height = "10px")),

          items.map { item =>
            li(key := s"${item.path}", id := s"${item.id}",
              a(href := s"${item.path}", className := "myLeftA", title := s"${item.title}",
                i(className := s"fa ${item.faClass}"),
                span(className := "title", s"${item.title}"),
                span(className := "selected")
              )
            )
          }

        )

      )
    )

  }

}
